import { useEffect, useState } from 'react';
import { useParams } from 'react-router-dom';
import { Result } from 'antd-mobile';
// import { useGetProductInfo } from '@/services/product';
// import { TCourse } from '@/utils/type';
// import aa from "../../";
import axios from 'axios';
import BaseInfo from './components/BaseInfo';
import CourseInfo from './components/CourseInfo';
import BuyBottom from './components/BuyBottom';
import style from './index.module.less';
// import Hr from "@/components/Hr";

/**
 * 商品信息
 * @constructor
 */
const ProductInfo = () => {
  const { id } = useParams();

  const [data, setdata] = useState(null);
  useEffect(() => {
    getlist();
  }, []);
  const getlist = async () => {
    const { data } = await axios.get(`http://localhost:3000/courseDetaile?id=${id}`);

    const newData = data.data;
    if (newData && newData.length === 0) {

    } else {
      newData?.forEach((item:any) => {
        setdata(item);
      });
    }
  };

  if (!data) {
    return <Result title="提示" description="没有该商品信息" />;
  }
  return (
    <div className={style.container}>
      <BaseInfo data={data} />
      {/* <Hr /> */}
      <CourseInfo data={data} />
      <BuyBottom data={data} />
    </div>
  );
};

export default ProductInfo;
